import {
  createInbizSchema,
  createBaseSchema,
  createValidatorSchema,
  createComponentStyleSchema,
  createModelSchema,
  createSoureSchema,
  createDecoratorStyleSchema,
  getDefalutDecoratorProps,
  createComponentLayout,
  createSoureSchemaOld,
  createControllerSchema
} from '@inbiz/setters';
import SettingView from './webServer/components/setting';
import { EformDynamicList as LocaleEformDynamicList } from './locale';
import { createBehavior, createResource } from '@inbiz/core';
import { Field } from '@formily/core';
import { getPlatform } from '@inbiz/utils';
import MyAutoComplete from '@components/form/base/EformInput/designer/components/MyAutoComplete';
/**
 * 1.属性的默认值:defaultProps
 * 2.属性的json数据
 * */

export const defaultProps = {
  defaulttype: 'custom',
  placeholder: 'EformDynamicList.pleaseSelect',
  selecttype: false,
  autoGetData: true,
  default: '',
  systemDefaultValue: 'System_Var_LoginUserID',
  value: '',
  labelDirection: 'left',
  defaultValue: '',
  selectWindowHeight: 50,
  autoLoading: true,
};

export const EformDynamicList = createInbizSchema({
  attribute: {
    ...createBaseSchema({
      defaulttype: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'Radio.Group',
        enum: ['system', 'custom'],
        platform: 'web',
      },
      systemDefaultValue: {
        type: 'string',
        enum: [
          'System_Var_LoginUserID',
          'System_Var_LoginUserIdentityID',
          'System_Var_LoginUserName',
          'System_Var_LoginUserDeptID',
          'System_Var_LoginUserDeptName',
          'System_Var_LoginUserPostID',
          'System_Var_LoginUserPostName',
          'System_Var_LoginUserAccount',
          // 'System_Var_ParentWindowID',
        ],
        'x-decorator': 'FormItem',
        'x-component': 'Select',
        'x-reactions': {
          dependencies: ['.defaulttype'],
          fulfill: {
            state: {
              visible: "{{$deps[0] == 'system'}}",
            },
          },
        },
        platform: 'web',
      },
      default: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'Input',
        'x-reactions': {
          dependencies: ['.defaulttype'],
          fulfill: {
            state: {
              visible: "{{$deps[0] == 'custom'}}",
            },
          },
        },
        platform: 'web',
      },
      dropdownHeight: {
        type: 'number',
        'x-decorator': 'FormItem',
        'x-component': 'NumberPicker',
        'x-component-props': {
          addonAfter: 'px',
        },
        platform: 'web',
      },
      // labelDirection: {
      //   type: 'string',
      //   'x-decorator': 'FormItem',
      //   'x-component': 'Radio.Group',
      //   enum: ['left', 'top'],
      //   platform: 'wap',
      // },
      defaultValue: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'Input',
        platform: 'wap',
      },
      placeholder: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'MultilingualInput',
      },
      selectWindowHeight: {
        type: 'number',
        'x-decorator': 'FormItem',
        'x-component': 'NumberPicker',
        'x-component-props': {
          addonAfter: '%',
        },
        platform: 'wap',
      },
      selecttype: {
        type: 'boolean',
        'x-decorator': 'FormItem',
        'x-component': 'Switch',
      },
      autoLoading: {
        type: 'boolean',
        'x-decorator': 'FormItem',
        'x-component': 'Switch',
      },
      search: {
        type: 'boolean',
        'x-decorator': 'FormItem',
        'x-component': 'Switch',
        'x-component-props': {
          defaultChecked: false,
        },
        platform: 'wap',
      },
      searchField: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': MyAutoComplete,
        'x-component-props': {
          mode: 'multiple',
        },
        'x-reactions': {
          dependencies: [
            'form.senior.soure.sourceModelUpdate',
            'form.attribute.base.x-component-props.search',
          ],
          fulfill: {
            state: {
              visible: '{{$deps[1] == true}}',
            },
            schema: {
              //@ts-ignore
              'x-component-props.update': '{{$deps[0]}}',
              'x-component-props.valueType': 'value',
              // 'x-hidden':'{{!$deps[1]}}'
            },
          },
        },
        platform: 'wap',
      },
      showconfig: {
        type: 'object',
        'x-decorator': 'FormItem',
        'x-component': SettingView,
      },
    }),
    ...createValidatorSchema(false),
  },
  style: {
    ...createComponentStyleSchema(),
    ...createComponentLayout(),
    ...createDecoratorStyleSchema(),
  },
  senior: {
    ...createModelSchema({
      childModelConfig: {
        type: 'boolean',
        'x-decorator': 'FormItem',
        'x-component': 'Switch',
      },
      storageConfig: {
        type: 'object',
        'x-decorator': 'FormItem',
        'x-component': 'StorageConfig',
        'x-component-props': {
          type: 'dtList',
        },
        'x-reactions': {
          dependencies: ['.childModelConfig'],
          fulfill: {
            state: {
              visible: "{{$deps == 'true'}}",
            },
          },
        },
      },
    }),
    ...createSoureSchema({
      isApi: true,
      props: {
        resultKeys: ['Success', 'Rows', 'Total'],
        isPrimaryKey: true,
        isEdit: true // 启用编辑配置
      },
      fieldChange: (form, value) => {
        if (!value?.isChangeModel) {
          return;
        }
        let modelName;
        const list = value?.queryField?.map((item) => {
          if (item.Master) {
            modelName = item.ModelName;
          }
          return {
            SelectText: true,
            Text: item.ColName,
            Value: item.AnotherName
              ? item.AnotherName
              : item.Master
                ? item.FieldName.split('$')[1]
                : item.FieldName,
            Width: '100',
            YsField: item.Master ? item.FieldName.split('$')[1] : item.FieldName,
            modelName: item.ModelName,
          };
        });
        let showconfig = {
          list,
          modelName: modelName,
          pageSize: 10,
          selectName: list[0].Value,
        };
        const field = form.query(/showconfig$/).take() as Field;
        if (field.value.list?.length) {
          // 过滤掉查询器中不存在的配置项
          let newList: any[] = [];
          field.value.list.map((item: any) => {
            list?.map((listItem: any) => {
              if (listItem.Value == item.Value) {
                newList.push(listItem);
              }
            });
          });
          showconfig.list = newList;
          field.value = showconfig;
        } else {
          field.value = showconfig;
        }
      },
    }),
  },
  controller: createControllerSchema({
    events: [{
      name: "onClick",
      label: "点击",
      platform: 'web'
    },
    {
      name: "onChange",
      label: "变更"
    },
    {
      name: "onSelect",
      label: "选中",
      platform: 'wap'
    },
    {
      name: "onLoad",
      label: "加载"
    },
    {
      name: "onSuccess",
      label: "成功"
    },
    {
      name: "onError",
      label: "报错"
    }, {
      name: "onDropdownVisibleChange",
      label: "下拉框变更",
      platform: 'web'
    }, {
      name: 'onRequest',
      label: '自定义请求',
      isConfigEvent: true,
    },{
      name: 'onData',
      label: '格式化数据',
      isConfigEvent: true,
    }, {
      name: 'onParamFormat',
      label: '格式化参数',
      isConfigEvent: true,
    }, {
      name: 'onTextParamFormat',
      label: '自定义数据详情请求',
      isConfigEvent: true,
    },{
      name: 'onTextRequest',
      label: '格式化详情数据',
      isConfigEvent: true,
    }, {
      name: 'onTextData',
      label: '格式化详情参数',
      isConfigEvent: true,
    }]
  })
});

export const Behavior = createBehavior({
  extends: ['Field'],
  name: 'EformDynamicList',
  selector: (node: any) => node.props['x-component'] === 'EformDynamicList',
  designerLocales: LocaleEformDynamicList,
  designerProps: {
    propsSchema: EformDynamicList,
  },
});

export const Resource = createResource({
  icon: 'DynamicList',
  elements: [
    {
      componentName: 'Field',
      props: {
        type: 'sting',
        title: {
          value: 'EformDynamicList.title',
          status: true,
        },
        'x-decorator': 'FormItem',
        'x-component': 'EformDynamicList',
        'x-component-props': defaultProps,
        'x-decorator-props': getDefalutDecoratorProps(getPlatform()),
      },
    },
  ],
});
